#{extends 'main.html' /}
#{set title:'Home' /}

<div style="float: left; position: relative; width: 69%;">

<div class="news">
<fieldset>
<legend>Recent Comments</legend>
<ul>
#{list items:comments, as:'comment'}
<li style="margin-left: 20px;"><strong>${comment?.user?.name}</strong> comments on <a href="/s/${comment?.serie?.id}">${comment?.serie?.name}</a>: 
#{if comment?.comment.startsWith("<spoiler>") && comment?.comment.endsWith("</spoiler>")}
	<div class="spoiler">
    <input type="button" onclick="showSpoiler(this);" value="Show/Hide Spoiler" />
    <div class="inner" style="display:none;">
	<i> " ${comment?.comment.replaceAll("<[^>]*>", "")} " </i>
	</div>
	</div>
	#{/if}
	
	#{else}
	<br /> &nbsp; <i> " ${comment?.comment}"
	#{/else} </i></li>
#{/list}
</ul>
</fieldset>
</div>


<div class="clear" style="height: 20px"></div>


<div class="news">
<fieldset>
<legend>Recent Topics</legend>
<ul>
#{list items:topics, as:'topic'}
<li style="margin-left: 20px;"><strong>${topic?.user?.name}</strong> creates a new Topic on <a href="/s/${topic?.serie?.id}">${topic?.serie?.name}</a>: <br /><a href="/s/${topic?.serie?.id}/topicdetail/${topic?.id}">-> ${topic?.topicName}</a> </i></li>
#{/list}
</ul>
</fieldset>
</div>


<div class="clear" style="height: 20px"></div>


<div class="news">
<fieldset>
<legend>Recent Videos</legend>
<ul>
#{list items:videos, as:'video'}
<li style="margin-left: 20px;"><strong>${video?.user?.name}</strong> adds a new Video on <a href="/s/${video?.serie?.id}">${topic?.serie?.name}</a>: <br />-> <a href="/s/${video?.serie?.id}/video/${video?.id}">${video?.name}</a> </i></li>
#{/list}
</ul>
</fieldset>
</div>


<div class="clear" style="height: 20px"></div>


<div class="news">
<fieldset>
<legend>Recently Added Episodes</legend>
<ul>
#{list items:episodes, as:'episode'}
<li style="margin-left: 20px;">Season <strong>${episode?.season}</strong>, Episode <strong>${episode?.episode}</strong> added to <a href="/s/${episode?.serie?.id}">${episode?.serie?.name}</a>: <br />-> <a href="/s/${episode?.serie?.id}/episodes/${episode?.id}">${episode?.title}</a> </i></li>
#{/list}
</ul>
</fieldset>
</div>

</div>


<div style="float: right; position: relative; width: 29%;">


<div class="series_follow" style="margin-right: 20px; margin-top: 10px;">
	<img src="@{'/public/images/facebookShareIcon.png'}" width="14" height="14" border="0" style="vertical-align:middle;" />
	<a href="#"  onclick="FacebookInviteFriends();">Invite Your Friends!</a>
</div>


<div class="clear" style="height: 20px"></div>


<div class="sug_series">
<fieldset>
<legend>Suggested TV Series</legend>

<li><a href="/s/${series?.get(0).id}">${series?.get(0).name}</a></li>
<li><a href="/s/${series?.get(1).id}">${series?.get(1).name}</a></li>
<li><a href="/s/${series?.get(2).id}">${series?.get(2).name}</a></li>
<li><a href="/s/${series?.get(3).id}">${series?.get(3).name}</a></li>
<li><a href="/s/${series?.get(4).id}">${series?.get(4).name}</a></li>

</fieldset>
</div>


<div class="clear" style="height: 20px"></div>


<div class="sug_series">
<fieldset>
<legend>Today's Episodes</legend>

#{if todayEpisodes.size() == 0}
<div style="text-align: center">No episodes for today!</div>
#{/if}

#{list items:todayEpisodes, as:'ep'}
<li><a href="/s/${ep?.serie?.id}/episodes/${ep?.id}">${ep?.title}</a></li>
#{/list}
</fieldset>
</div>

</div>